﻿<%@ Page Title="" Language="C#" MasterPageFile="~/TestCase.Master" AutoEventWireup="true" CodeBehind="GoogleMapTests.aspx.cs" Inherits="OpenWaves.Web.Tests.GoogleMapTests" %>
<%@ Register TagPrefix="a" Namespace="OpenWaves.Web.Tests" Assembly="OpenWaves.Web.Tests" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="TestCasePlaceHolder" runat="server">
        <h1>Empty map</h1>
        <div style="float: left">
            <h2>Initialized</h2>
            <ow:GoogleMap runat="server" Width="400" Height="400"/>
        </div>

        <div style="float: left">
            <h2>Fallback</h2>
            <ow:GoogleMap ID="GoogleMap3" runat="server" Width="400" Height="400" InitializeGoogleMap="false"/>
        </div>

        <div style="clear: both" />

        <h1>Empty map, Viewport: Center and zoom</h1>
        <div style="float: left">
            <h2>Initialized</h2>
            <ow:GoogleMap ID="GoogleMap5" runat="server" Width="400" Height="400">
                <Viewport Center="10, 10" Zoom="<%# 5 %>" />
            </ow:GoogleMap>
        </div>

        <div style="float: left">
            <h2>Fallback</h2>
            <ow:GoogleMap ID="GoogleMap1" runat="server" Width="400" Height="400" InitializeGoogleMap="false">
                <Viewport Center="10, 10" Zoom="5" />
            </ow:GoogleMap>
        </div>

        <div style="clear: both" />

        <h1>Empty map, Viewport: Bounds</h1>
        <div style="float: left">
            <h2>Initialized</h2>
            <ow:GoogleMap ID="GoogleMap10" runat="server" Width="400" Height="400">
                <Viewport Bounds="(10, 10); (20, 20)" />
            </ow:GoogleMap>
        </div>

        <div style="float: left">
            <h2>Fallback</h2>
            <ow:GoogleMap ID="GoogleMap11" runat="server" Width="400" Height="400" InitializeGoogleMap="false">
                <Viewport Bounds="(10, 10);(20, 20)" />
            </ow:GoogleMap>
        </div>

        <div style="clear: both" />

        <h1>Basic markers - AutoViewport</h1>
        <div style="float: left">
            <h2>Initialized</h2>
            <ow:GoogleMap ID="GoogleMap4" runat="server" Width="400" Height="400" 
                DataSource="<%# this.Hospitals %>" 
                ToolTipMember="Name" 
                LongitudeMember="Location.Longitude"  
                LatitudeMember="Location.Latitude"/>
        </div>

        <div style="float: left">
            <h2>Fallback</h2>
            <ow:GoogleMap ID="GoogleMap2" runat="server" Width="400" Height="400" InitializeGoogleMap="false"
                DataSource="<%# this.Hospitals %>" 
                ToolTipMember="Name" 
                LongitudeMember="Location.Longitude"  
                LatitudeMember="Location.Latitude"/>
        </div>

        <div style="clear: both" />

        <h1>Info windows</h1>
        <div style="float: left">
            <h2>Basic, No tooltips</h2>
            <ow:GoogleMap ID="GoogleMap8" runat="server" Width="400" Height="400" AutoViewport="true"
                DataSource="<%# this.Hospitals %>" 
                LongitudeMember="Location.Longitude"  
                LatitudeMember="Location.Latitude">
                <InfoWindowTemplate>
                    <%#Eval("Name") %>
                </InfoWindowTemplate>
            </ow:GoogleMap>
        </div>

        <div style="float: left">
            <h2>Override onMarkerClicked</h2>
            <ow:GoogleMap ID="GoogleMap9" runat="server" Width="400" Height="400" AutoViewport="true"
                DataSource="<%# this.Hospitals %>" 
                LongitudeMember="Location.Longitude"  
                LatitudeMember="Location.Latitude"
                ToolTipMember="Name"> 
                <InfoWindowTemplate>
                    <%#Eval("Name") %>
                </InfoWindowTemplate>
            </ow:GoogleMap>

            <script type="text/javascript">
                (function () {
                    var mapControl = <%=this.GoogleMap9.ClientID %> ;
                    var previousWindow = null;

                    mapControl.mapOptions.zoom = 0;

                    mapControl.onMarkerClicked = function (map, marker) {
                        if (previousWindow != null)
                            previousWindow.close();
                        marker.infoWindow.open(map);
                        previousWindow = marker.infoWindow;
                    };
                })();
            </script>
        </div>

        <div style="clear: both" />

        <div style="float: left">
            <h2>Typed DataSource</h2>
            <a:HospitalsMap runat="server" ID="HospitalMap" Width="300" Height="300" 
                AutoViewport="true"
                DataSource="<%# this.Hospitals %>"> 
                <InfoWindowTemplate>
                    <%#Container.Item.Description %>
                </InfoWindowTemplate>
            </a:HospitalsMap>
        </div>

        <div style="float: left">
            <h2>Custom marker image</h2>
            <a:HospitalsMap runat="server" ID="HospitalsMap1" Width="300" Height="300" 
                AutoViewport="true"
                MarkerIconUrl = "/TheBossIcon.png"
                DataSource="<%# this.Hospitals %>"> 
                <InfoWindowTemplate>
                    <%#Container.Item.Description %>
                </InfoWindowTemplate>
            </a:HospitalsMap>

            <script type="text/javascript">
                (function() {
                    var mapControl = <%=HospitalsMap1.ClientID %>;

                    mapControl.onMarkerClicked = function(map, marker) {
                        alert(marker.dataItem.toolTip);
                    };
                })();
            </script>

        </div>

        <div style="clear: both" />
</asp:Content>
